<template>
  <div class="execution">
    <basic-container>
      <!-- 修改这里的样式，使子元素垂直排列 -->
      <div style="display: block; flex-direction: column;height: 50px;line-height: 50px;background: white;margin-bottom: 10px;">
<!--        <div style="display: block; align-items: center; margin-bottom: 5px;float:left;">
          <el-select v-model="selectedType" placeholder="请选择类型" filterable  style="width: 200px; margin-left: 5px">
            <el-option
              v-for="item in internalCategory"
              :key="item.id"
              :label="item.label"
              :value="item.label"
              @click.native="getDocNoListData(item.label)">
            </el-option>
          </el-select>
        </div>-->
        <el-select v-model="docNo" placeholder="请选择工单号" filterable clearable style="width:200px;float:left; margin-left: 5px;">
          <el-option
            v-for="item in docNoList"
            :key="item.id"
            :label="item.docNo"
            :value="item.docNo"
            @click.native="getData()">
          </el-option>
        </el-select>
        <el-button type="primary" style="width: 100px; margin-left: 5px;" @click="getData()">查询</el-button>
      </div>
      <avue-crud
        ref="crud"
        :page.sync="page"
        :data="tableData"
        :permission="permissionList"
        :table-loading="tableLoading"
        :option="tableOption"
        @search-change="searchChange"
        @refresh-change="refreshChange"
        @size-change="sizeChange"
        @current-change="currentChange"
        @row-update="handleUpdate"
        @row-save="handleSave"
        @row-del="handleDel">
        <!--        <template slot="menuLeft">
                  <el-button
                    v-if="permissions.workorder_opltshhs_export"
                    class="filter-item"
                    plain
                    type="primary"
                    size="small"
                    icon="el-icon-download"
                    @click="exportExcel">导出
                  </el-button>
                </template>-->
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
import { fetchList } from '@/api/workorder/opltshhs4-3'
import { tableSummaryAloneOption } from '@/const/crud/workorder/opltshhs'
import { mapGetters } from 'vuex'
import { getDocNo43List, getDocNoListByType } from "@/api/workorder/workordercps"
import { remote } from "@/api/admin/dict";

export default {
  name: 'opltshhs',
  props: {
    docNo: { //工单
      type: String
    },
    workshopName: { //车间
      type: String
    },
    realityLineName: { //产线
      type: String
    },
    itemCode: { //品号
      type: String
    }
  },
  data() {
    return {
      searchForm: {},
      tableData: [],
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 10 // 每页显示多少条
      },
      tableLoading: false,
      tableOption: tableSummaryAloneOption,
      docNoList: [],
      //docNo: null,
      localDocNo: this.docNo, // 使用不同的名称存储
      selectedType: '', // 默认选择GEN
      internalCategory:[],
      type:null,
    }
  },
  watch: {
    docNo(newVal) {
      this.localDocNo = newVal
    }
  },
  computed: {
    ...mapGetters(['permissions']),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permissions.workorder_opltshhs_add, false),
        delBtn: this.vaildData(this.permissions.workorder_opltshhs_del, false),
        editBtn: this.vaildData(this.permissions.workorder_opltshhs_edit, false)
      }
    }
  },
  created() {
    //获取内部品类
    this.getInternalCategoryData();
  },
  methods: {
    //获取内部品类
    getInternalCategoryData(){
      /*remote("inner_type").then(response => {
        this.internalCategory=response.data.data;
      })*/
      getDocNo43List().then(response => {
        this.docNoList = response.data.data;
      })
    },
    getDocNoListData(type) {
      if(this.type===type){
        return
      }else{
        this.docNo=null;
        this.type=type;
      }
      getDocNoListByType(type).then(response => {
        this.docNoList = response.data.data
      })
    },
    getData() {
      if (this.validatenull(this.docNo)) {
        this.$message.error('请输入工单!')
        return
      }
      this.searchForm.docNo = this.docNo
      if (!this.validatenull(this.itemCode)) {
        this.searchForm.itemCode = this.itemCode
      }
      this.tableLoading = true
      fetchList(Object.assign({
        current: this.page.currentPage,
        size: this.page.pageSize
      }, this.searchForm)).then(response => {
        this.tableData = response.data.data.records
        this.page.total = response.data.data.total
        this.tableLoading = false
      }).catch(() => {
        this.tableLoading = false
      })
    },

    // 列表查询
    getList(page, params) {
      if (!this.validatenull(this.docNo)) {
        this.searchForm.docNo = this.docNo
      }
      /*      if(!this.validatenull(this.workshopName)){
              this.searchForm.workshopName = this.workshopName;
            }
            if(!this.validatenull(this.realityLineName)){
              this.searchForm.realityLineName = this.realityLineName;
            }*/
      if (!this.validatenull(this.itemCode)) {
        this.searchForm.itemCode = this.itemCode
      }
      this.tableLoading = true
      fetchList(Object.assign({
        current: page.currentPage,
        size: page.pageSize
      }, params, this.searchForm)).then(response => {
        this.tableData = response.data.data.records
        this.page.total = response.data.data.total
        this.tableLoading = false
      }).catch(() => {
        this.tableLoading = false
      })
    },
    // 删除
    handleDel: function(row, index) {
      this.$confirm('是否确认删除ID为' + row.$pk.lowerAttrName, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        return delObj(row.$pk.lowerAttrName)
      }).then(data => {
        this.$message.success('删除成功')
        this.getList(this.page)
      })
    },
    // 更新
    handleUpdate: function(row, index, done, loading) {
      putObj(row).then(data => {
        this.$message.success('修改成功')
        done()
        this.getList(this.page)
      }).catch(() => {
        loading()
      })
    },
    // 保存
    handleSave: function(row, done, loading) {
      addObj(row).then(data => {
        this.$message.success('添加成功')
        done()
        this.getList(this.page)
      }).catch(() => {
        loading()
      })
    },
    // 每页条数改变事件
    sizeChange(pageSizec) {
      this.page.pageSize = pageSizec
      this.getList(this.page)
    },
    // 当前页发生改变事件
    currentChange(current) {
      this.page.currentPage = current
      this.getList(this.page)
    },
    // 查询事件
    searchChange(form, done) {
      // this.searchForm = form
      this.page.currentPage = 1
      this.getList(this.page, form)
    },
    // 刷新事件
    refreshChange() {
      this.getList(this.page)
    },
    //  导出excel
    exportExcel() {
      this.downBlobFile('/workorder/opltshhs/export', this.searchForm, 'opltshhs.xlsx')
    },
    validatenull(val) {
      return val === null || val === undefined || val === ""
    },
    vaildData(val, def) {
      return val || def
    }
  }
}
</script>

<style scoped>
/deep/ .avue-crud__menu {
  min-height: 0px!important;
}
/deep/.el-card__body, .el-main{
  padding: 0px!important;
}
</style>
